<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
    <title>日程助理</title>
    <link rel="stylesheet" href="../../../css/mui.min.css" />
    <script src="../../../js/mui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="../../../css/app.css" />
    <link rel="stylesheet" href="../../../npl/css/vant.mini.css" />
    <link rel="stylesheet" href="../css/tripAgent.css " />
    <script src="../../../js/jquery-3.6.0.min.js"></script>
    <script src="../../../js/flexible.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../../../js/sm2.js"></script>
    <script src="../../../js/sm3.js"></script>
    <script src="../../../js/clipboard.js"></script>
    <script src="../../../npl/js/vant.mini.js"></script>
    <script src="../../../js/vconsole.min.js"></script>
    <script src="../../text.js" type="text/javascript"></script>

    <script src="../js/util.js" type="text/javascript"></script>

    <style>

    </style>
</head>
<body>
<div id="app" v-cloak>
    <div class="is-loading">
        <div class="curtain">
            <div class="loadingBgc">
                <div class="loader"></div>
            </div>
        </div>
    </div>
    <div class="trainTickets">
        <div class="header_tit">
            <van-nav-bar title="日程助理" left-arrow>
                <template #left>
                    <div class="back_l" @click="home">
                        <img src="../../../image/left.png" alt="" />
                    </div>
                </template>
                <template #right>
                    <div v-if="!multiChoose" class="select-all-btn active-brightness" @click="multiChoose = true">
                        多选
                    </div>
                    <div v-if="multiChoose" class="select-all-btn active-brightness" @click="handleMultiChooseShow">
                        取消
                    </div>
                </template>
            </van-nav-bar>
        </div>
        <div :class="['agent-list-main', multiChoose ? 'main-short' : 'main-all']">
            <div class="agent-org">
                {{currentOrg}}
            </div>
            <van-checkbox-group class="agent-card-group" v-model="checkAgentUser">
                <div class="agent-card-add" @click="onAdd">
                    <div role="button" tabindex="0" style="display: flex;">
                        <!-- <i class="van-icon van-icon-add-square van-cell__left-icon"></i> -->
                        <img src="../../yr/images/trip-add.png" alt="" />
                        <div class="agent-card-add-text">添加日程助理</div>
                    </div>
                </div>
                <div :class="['agent-card-list']" v-for="(item, index) in agentList" @click="toggle(index, item)">
                    <div class="card-main">
                        <img src="../../yr/images/trip-user.png" alt="" />
                        <div class="card-content">
                            <div class="card-item-row1">
                                <div class="">
                                    <div class="card-agent-name">{{item.agentName}}</div>
                                </div>
                                <div class="card-agent-namecode">
                                    <div class="card-agent-namecode-text">{{item.agentNameCode}}</div>
                                </div>
                            </div>
                            <div class="card-item-row2">{{item.showOrgName}}</div>
                        </div>
                    </div>
                    <div class="card-checkbox" v-if="multiChoose">
                        <van-checkbox :name="item" ref="checkboxes" />
                    </div>
                </div>
            </van-checkbox-group>
        </div>
        <div class="agent-bottom" v-if="multiChoose">
            <div class="agent-bottom-left">
                <van-checkbox class="agent-checkbox" v-model="chooseAll" 
                @click="chooseAgentAllClick" icon-size="24px">全选</van-checkbox>
            </div>
            <div class="agent-bottom-right">
                <van-button type="danger" size="small" @click="handleDeleteAgentUser">删除</van-button>
            </div>
        </div>
    </div>
    <van-popup v-model="chooseUserPop" position="left" :style="{ width: '100%',height: '100%' }">
        <div class="choose-user-pop">
            <van-nav-bar title="日程助理" :border=false left-arrow>
                <template #left>
                    <div class="back_l" @click="closeChooseUserPop">
                        <img src="../../../image/left.png" alt="" />
                    </div>
                </template>
                <template #right>
                </template>
            </van-nav-bar>
            <div class="choose-user-list">
                <div class="search-container">
                    <input class="search-input" v-model="searchUser" placeholder="请输入姓名或账号"/>
                    <div class="search-btn" @click="searchChooseAgentUser()">
                        <img src="../../yr/images/write/search-btn.png"/>
                    </div>
                </div>
                <!-- <van-pull-refresh class="user-card-group" v-model="refreshing" @refresh="onRefresh"> -->
                    <van-list class="user-card-group" v-model="loading" :finished="finished" finished-text="没有更多了" @load="pageQueryChooseAgentUser()">
                        <van-checkbox-group v-model="checkUser">
                            <div :class="['user-card-list', 0 == index ? 'user-card-list-first': '']" v-for="(item, index) in toChooseUser" @click="toggleUser(index, item)">
                                <div class="card-main">
                                    <img src="../../yr/images/trip-user.png" alt="" />
                                    <div class="card-content">
                                        <div class="card-item-row1">
                                            <div class="">
                                                <div class="card-agent-name">{{item.name}}</div>
                                            </div>
                                            <div class="card-agent-namecode">
                                                <div class="card-agent-namecode-text">{{item.nameCode}}</div>
                                            </div>
                                        </div>
                                        <div class="card-item-row2">{{item.showOrgName}}</div>
                                    </div>
                                </div>
                                <div class="card-checkbox">
                                    <van-checkbox :name="item" ref="checkboxes2" />
                                </div>
                            </div>
                        </van-checkbox-group>
                    </van-list>
                <!-- </van-pull-refresh> -->
                <div class="user-bottom">
                    <div class="user-bottom-left">
                        <van-checkbox class="user-checkbox" v-model="chooseUserAll" 
                        @click="chooseUserAllClick" icon-size="24px">全选</van-checkbox>
                    </div>
                    <div class="user-bottom-right">
                        <van-button type="info" size="small" @click="handleAddUser">选择</van-button>
                    </div>
                </div>
            </div>
        </div>
    </van-popup>
</div>

<script src="../js/tripAgent.js"></script>
</body>
</html>
